<template>
	<view class="content">
		<form @submit="formSubmit">
			<view class="user_name_box">
				<view class="left">账号名：</view>
				<input name="username" type="text" placeholder="请输入大客户账号名" />
			</view>
			<view class="password_box">
				<view class="left">密码：</view>
				<input type="password" name="password" placeholder="请输入大客户账号密码">
			</view>
			<button class="submit_btn" form-type="submit">登录</button>
		</form>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				open_id: '',
				session_key: '',
				union_id: '',
				username: '',
				password: '',
			}
		},
		onLoad() {
			// 获取登录信息
			uni.getStorage({
				key: 'login_data',
				success: res => {
					this.open_id = res.data.open_id;
					this.session_key = res.data.session_key;
					this.union_id = res.data.union_id;
				}
			})
		},
		methods: {
			formSubmit (e) {
				this.username = e.detail.value.username
				this.password = e.detail.value.password
				if (this.union_id == null) {
					this.union_id = ''
				}
				this.$https.post(
					'api/mini_customer/v1/customers/login',{
						username: this.username,
						password: this.password,
						open_id: this.open_id,
						union_id: this.union_id
					},
				)
				.then(res => {
					if (res.data.token){
						uni.setStorage({
							key: 'token',
							data: res.data.token,
							success: res => {
								uni.switchTab({
									url: '/pages/index/index',
									success: e => {
										// switch页面跳转后不刷新 手动onload
										var page = getCurrentPages().pop();
										if (page == undefined || page == null) return;
										page.onLoad();
									}
								})
							}
						})
					}
				})
			}
		}
	}
</script>

<style>
	.content {
		width: 100%;
		padding-top: 24rpx;
		height: calc(100% - 24rpx);
		background: linear-gradient(135deg, #3BB0C3 0%, #13A684 100%);;
	}
	.user_name_box,.password_box{
		width: calc(100% - 48rpx);
		height: 120rpx;
		margin-left: 24rpx;
		border-radius: 12rpx;
		background-color: #ffffff;
		display: flex;
		align-items: center;
		margin-bottom: 24rpx;
	}
	.left{
		margin-left: 24rpx;
		width: 112rpx;
		font-size: 28rpx;
		color: #333333;
	}
	input{
		font-size: 28rpx;
		color: #333333;
	}
	.submit_btn{
		margin-top: 24rpx;
		margin-left: 24rpx;
		width: calc(100% - 52rpx);
		border: 1px solid #ffffff;
		color: #ffffff;
		background: none;
		border-radius: 12rpx;
		font-size: 40rpx;
	}
</style>
